<div class="row">
    <div class="col-sm-20">
        <h1 class="pagetitle" translate lib="web">{{ctrl.model.name}}</h1>
    </div>
</div>
<style type="text/css">
    .list-group-item:hover {
        color: #337ab7;
        text-shadow: 0 0 1em #337ab7;
        cursor: pointer;
    }

    .listgroupitemselected {
        border: 6px;
        border-color: black;
        background-color: #337ab7;
        color: white;
        cursor: pointer;
    }

    textarea {
        border: 0 none white;
        overflow: hidden;
        padding: 0;
        outline: none;
        background-color: #D0D0D0;
    }

    textarea.form-control {
        min-height: unset !important;
    }

    .secret {
        -webkit-text-security: disc;
    }
</style>
<pre ng-show="ErrorMessage!=null">{{ ErrorMessage }}</pre>
<div ng-show="ctrl.errormessage != ''"" class=" alert alert-danger" role="alert">{{ctrl.errormessage}}</div>
<form ng-submit="ctrl.submit()" class="form-horizontal" role="form" autocomplete="off">

    <div class="form-group">
        <label for="name" class="col-sm-2 control-label" translate lib="web">name</label>
        <div class="col-sm-4">
            <input ng-model="ctrl.model.name" class="form-control input-md" ng-disabled="ctrl.loading==true" />
        </div>
    </div>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label" translate lib="web">queue</label>
        <div class="col-sm-4">
            <select id="menucollections" ng-model="ctrl.model.wiq" ng-show="!ctrl.model._id || ctrl.model._id == ''"
                ng-options="item.name as item.name for item in ctrl.workitemqueues">
            </select>
            <span ng-show="ctrl.model._id && ctrl.model._id != ''">{{ctrl.model.wiq}}</span>

        </div>
    </div>

    <div class="form-group" ng-show="ctrl.model._id && ctrl.model._id != ''">
        <label for="state" class="col-sm-2 control-label" translate lib="web">state</label>
        <div class="col-sm-4">
            <select class="form-control" id="country" ng-model="ctrl.model.state" required="required"
                ng-disabled="ctrl.loading==true">
                <option value="new">New</option>
                <option value="failed">Failed</option>
                <option value="successful">Successful</option>
                <option value="processing">Processing</option>
                <option value="retry">Retry</option>
            </select>
        </div>
    </div>
    <div class="form-group">
        <label for="newpassword" class="col-sm-2 control-label" translate lib="web">payload</label>
        <div class="col-sm-4">
            <textarea json-text class='form-control' rows='1' data-min-rows='1'
                ng-model="ctrl.model.payload"></textarea>
        </div>
    </div>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label" translate lib="web">retries</label>
        <div class="col-sm-6">
            <input type="number" ng-model="ctrl.model.retries" class="input-md" ng-disabled="true" />
        </div>
    </div>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label" translate lib="web">priority</label>
        <div class="col-sm-6">
            <input type="number" ng-model="ctrl.model.priority" class="input-md" step=1 min=0 max=99  />
        </div>
    </div>
    <div class="form-group" ng-show="ctrl.model.errormessage && ctrl.model.errormessage != ''">
        <label for="newpassword" class="col-sm-2 control-label" translate lib="web">errormessage</label>
        <div class="col-sm-4">
            <!-- <textarea json-text class='form-control' rows='1' data-min-rows='1'
                ng-model="ctrl.model.errormessage"></textarea> -->
            {{ctrl.model.errormessage}}
            <span ng-show="ctrl.model.errorsource && ctrl.model.errorsource != ''">
                at {{ctrl.model.errorsource}}
            </span>
        </div>
    </div>
    <div class="form-group" ng-show="ctrl.model.wiq && ctrl.model.wiq != ''">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="submit" ng-disabled="ctrl.loading==true" class="btn btn-success" translate
                lib="web">save</button>
        </div>
    </div>
    <style>
        .wiimg  {
            /* width:100%; */
            max-width:200px;
        }
        /* .wiimg:hover  {
            all: unset;
        } */
    </style>
    <div ng-show="ctrl.model._id != ''">
        <div class="row">
            <label class="col-sm-2 control-label" translate lib="web">files</label>
        </div>
        <div class="row" ng-repeat="file in ctrl.model.files">
            <div class="col-sm-4">
                
                <div ng-show="file.filename.endsWith('.png') || file.filename.endsWith('.gif') || file.filename.endsWith('.jpg')">
                    <a ng-href="/download/{{file._id}}">
                        <img src="/download/{{file._id}}" class="wiimg" alt="{{ file.name }}"/>
                    </a>
                </div>
                <div ng-show="!file.filename.endsWith('.png') && !file.filename.endsWith('.gif') && !file.filename.endsWith('.jpg')">
                    {{ file.name }}
                    <a ng-href="/download/{{file._id}}" class="table-btn" >
                        <em class="fas fa-file-download"></em>
                    </a>
                </div>
            </div>
        </div>
        <div class="row form-group">
            <label class="col-sm-2 control-label"></label>
        </div>

    </div>


</form>